<template>
	<view>
		<view class="top">
			<view class="search">
				<input type="text" placeholder="搜索地址">
			</view>
		</view>
		<view class="address">
			当前地址
		</view>
		<view class="current">
			
			   {{positionInfo.address}}    <view @click="getCurrentLocation" style="float: right;color: #4D8175;">重新定位</view>
		</view>
		<view class="address">
			被护理人地址
		</view>
		<view class="current">
			
			被护理人信息  
		</view>
		<!-- <view style="top">
			{{positionInfo.address}}
		</view> -->
		<!-- <button type="primary" @click="getCurrentLocation()">获取当前位置</button> -->
		<!-- <button type="primary" @click="getaddress()">获取选择的位置</button> -->
		<view style="background-color: #4D857B;width: 80%;height: 100rpx;background-color: #4D8175;border-radius: 50rpx;color: white;display: flex;justify-content: center;align-items: center;font-size: 40rpx;margin: auto;margin-top: 70%;" class="">
			新增地址
			
		</view>
	</view>
</template>
 
<script>
	// import { VueJsonp } from 'vue-jsonp'
	export default {
		data() {
			return {
				positionInfo: {
					address: '',
					longitude: '', //经度
					latitude: '', //纬度
				},
 
			}
		},
		methods: {
			// 通过自带的方法获取到当前的经纬度，调用方法获取到地址获取到地址的中文信息
			getCurrentLocation() {
				 let that = this;
				  uni.getLocation({
				    success: function(res) {
				      const latitude = res.latitude;
				      const longitude = res.longitude;
				      
				      // 调用地理编码 API 获取地址信息
				      uni.request({
				        url: 'https://apis.map.qq.com/ws/geocoder/v1/',
				        data: {
				          location: `${latitude},${longitude}`,
				          key: 'PTSBZ-F6DKU-ZC5VB-BMIOA-7EBB6-EXBEH'
				        },
				        success(res) {
				          console.log(res);
				          if (res.data.status === 0) {
				            const addressComponent = res.data.result.address_component;
				                  const road = addressComponent.street_number || addressComponent.street;
				                  that.positionInfo.address = '' + road;
				          }
				        }
				      });
				    }
				  });
			},
			// 获取选择地址
			getaddress() {
				let that = this
				uni.chooseLocation({
					success: function(res) {
						console.log(res)
						that.positionInfo.address = '选择的位置是：' + res.address
					}
				});
			},
		}
	}
</script>
 
<style scoped>
	page{
		background-color: #F5F5F5;
	}
	.address{
		line-height: 100rpx;
		font-size: 30rpx;
		font-weight: 100;
	}
	.current{
		line-height: 100rpx;
		background-color: #FFFFFF;
		width: 100%;
		height: 100rpx;
	}
	.top{
		width: 100%;
		height: 150rpx;
		background-color: #FFFFFF;
		margin: auto;
		display: flex;
		justify-content: center;
		align-items: center;
		
	}
	.search{
		
		width: 90%;
		margin: auto;
		border: 1px solid #7FA892;
		border-radius: 50rpx;
		height: 60rpx;
		/* line-height: 100rpx; */
	
		/* justify-content: center; */
		/* align-items: center; */
		/* display: inline-block; */
		display: flex;
		align-items: center;
		margin-top: 50rpx;
	
	}
	input{
		margin-left: 50rpx;
	}
	
</style>
